window.onload = function () {
    var regtel = /^1[3|4|5|7|8]\d{9}$/; // 手机号码的正则表达式
    var regqq = /^[1-9]\d{4,}$/; // 10000
    var regnc = /^[a-zA-Z0-9]{2,8}$/;
    var regmsg = /^\d{4}$/;
    var regpwd = /^[a-zA-Z0-9_-]{3,16}$/;
    var tel = document.querySelector('#tel');
    // var qq = document.querySelector('#qq');
    var nc = document.querySelector('#nc');
    var msg = document.querySelector('#msg');
    var pwd = document.querySelector('#pwd');
    var surepwd = document.querySelector('#surepwd');
    regexp(tel, regtel); // 手机号码
    // regexp(qq, regqq); // qq号码
    regexp(nc, regnc); // 昵称
    regexp(msg, regmsg); // 短信验证
    regexp(pwd, regpwd); // 密码框
    // 表单验证的函数
    function regexp(ele, reg) {
        ele.onblur = function () {
            if (reg.test(this.value)) {
                // console.log('正确的');
                this.nextElementSibling.className = 'success';
                this.nextElementSibling.innerHTML = '<i class="success_icon"></i> 恭喜您输入正确';
            } else {
                // console.log('不正确');
                this.nextElementSibling.className = 'error';
                this.nextElementSibling.innerHTML = '<i class="error_icon"></i> 格式不正确，请从新输入 ';
            }

            if ($(ele).attr('id') == "tel") {
                // 当前是手机号
                // <input type="button" value="发送验证码" class="vcOver">
                let vcVtn = document.createElement("input");
                if (reg.test(this.value)) {
                    $(ele).parent().find('.vcOver').remove();
                    // 手机号校验通过
                    // 按钮的三个属性设置完成
                    $(vcVtn).attr('type', 'button');
                    $(vcVtn).attr('value', '发送验证码');
                    $(vcVtn).attr('class', 'vcOver');
                    $(vcVtn).attr('onclick', 'sendVcCode(this)');
                    $(ele).parent().append(vcVtn);
                } else {
                    // 手机号校验不通过
                    // $(ele).parent().remove(".vcOver");
                    $(ele).parent().find('.vcOver').remove();
                    // $(".vcOver").remove();
                }
            }
        }
    };

    // document.getElementsByClassName(".vcCode")[0].onclick = function(){
    //     console.log("发送验证码");
    // }

    surepwd.onblur = function () {
        if (this.value == pwd.value) {
            this.nextElementSibling.className = 'success';
            this.nextElementSibling.innerHTML = '<i class="success_icon"></i> 恭喜您输入正确';
        } else {
            this.nextElementSibling.className = 'error';
            this.nextElementSibling.innerHTML = '<i class="error_icon"></i> 两次密码输入不一致';

        }
    }

    // 给注册表单绑定事件
    $(".reg_form > form").submit(() => {
        // 获取表单中的值
        let uuid = $("input[name=uuid]").val().trim(); // 取uuid
        let tel = $("#tel").val().trim();// 取手机号
        let username = $("#nc").val().trim(); //用户名
        let code = $("#msg").val().trim(); //验证码
        let password = $("#pwd").val().trim(); //密码
        // let surepwd = $("#surepwd").val().trim(); //确认密码
        let agreeEle = document.getElementById("agree");
        // 判断协议是否选中
        if (agreeEle.checked == true) {
            // 选中
            // 发送ajax请求来完成用户注册功能
            $.post('/api/user/register', {
                username: username,
                password: md5(password),
                phone: tel,
                uuid: uuid,
                code: code
            }, ret => {
                console.log(ret);
                // 注册成功跳转到系统首页
                if (ret['code'] == 200) {
                    alert(ret['msg']);
                    window.location.href = '/login.html';
                }
            }, "json");
        } else {
            alert('未同意协议，不能注册');
        }
        return false;
    });
}

// 给发送验证码的按钮添加单击事件
function sendVcCode(self) {
    console.log("发送验证码");
    console.log(self);
    let phone = $("#tel").val().trim();
    $.getJSON("/api/vc/sendVc?phone=" + phone, ret => {
        console.log(ret);
        if (ret['code'] == 200) {
            alert(ret['msg']);
            $("input[name=uuid]").val(ret['data']['uuid']);
            // 设置倒计时
            // <input type="button" value="发送验证码" class="vcOver" onclick="sendVcCode(this)">
            let timeout = 300; // 倒计时剩余时间
            let fun = () => {
                // 对timeout判断
                if (timeout < 0) {
                    // 修改会发送验证码
                    $(self).val('发送验证码');
                    // 设置按钮可用
                    self.removeAttribute("disabled");
                    // 清除定时器
                    clearInterval(timerId);
                } else {
                    // 设置成禁用
                    self.setAttribute('disabled', 'disabled');
                    $(self).val('倒计时' + timeout + '秒');
                }
                timeout--;
            };
            fun();
            let timerId = setInterval(fun, 1000);
        }
    });
}